<template>
  <div class="career">
    <div class="list">
      <t-row :gutter="[8,0]">
        <t-col v-for="i in list" :key="i.id" :span="6">
          <t-card :bordered="false">
            <div class="whole">
              <div class="img">
                <img :src=i.src>
              </div>
              <div class="card-r">
                <span class="name">{{i.name}}</span>
                <span class="desc" :title=i.desc>{{i.desc}}</span>
              </div>
            </div>
          </t-card>
        </t-col>
      </t-row>
      <!-- 底部分页 -->
      <t-pagination :total="total"
      showPageNumber
      :showPageSize="false"
      :totalContent="false"
      showPreviousAndNextBtn
      @current-change="onCurrentChange"
      @change="onChange" />
    </div>
    <div class="right">
      <div class="now duiqi">
        <h3>近期上线</h3>
        <a class="right-a" href="javascript:;">教练员</a>
        <a class="right-a" href="javascript:;">整理收纳师</a>
        <a class="right-a" href="javascript:;">海洋工程技术人员</a>
        <a class="right-a" href="javascript:;">测绘和地理信息工程技术人员</a>
        <a class="right-a" href="javascript:;">宠物摄影师</a>
        <a class="right-a" href="javascript:;">心理医生</a>
        <a class="right-a" href="javascript:;">大数据工程技术人员</a>
      </div>
      <div class="hot duiqi">
        <h3>热门职业</h3>
        <a class="right-a" href="javascript:;">互联网产品经理</a>
        <a class="right-a" href="javascript:;">计算机软件工程师</a>
        <a class="right-a" href="javascript:;">小学教师</a>
        <a class="right-a" href="javascript:;">人力资源管理人员</a>
        <a class="right-a" href="javascript:;">会计人员</a>
        <a class="right-a" href="javascript:;">销售代表</a>
        <a class="right-a" href="javascript:;">机械工程技术人员</a>
        <a class="right-a" href="javascript:;">平面设计师</a>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      list: [
        {
          id: 4,
          src: 'https://t1.chei.com.cn/xzpt/survey/cdn/showimg/jz3p7nuv0g42g0hj.jpeg',
          name: '移动客户端开发工程师',
          desc: '移动客户端开发工程师是进行手机应用程序开发、手机视频播放器开发、手机游戏开发、SIM卡应用开发等一系列开发设计并提供现场技术支持的专业技术人员。今天，在移动运营商、手机厂商、互联网巨头的重视下，手机软件已然成为了一座金矿。手机软件的开发也从过去单一的短信、彩信、WAP功能，延伸覆盖了包括IM、浏览器、电子书阅读、手机杂志阅读、RSS阅读、杀毒软件、手机下载、游戏等等在内的多种应用种类。有人说，手机软件可以拯救移动互联网。手机应用开发的平台主要有Android、iOS、BlackBerry、Windows Phone等。'
        }
      ],
      total: 10,
      current: 12,
      pageSize: 4
    }
  },
  methods: {
    onCurrentChange (current, pageInfo) {
      console.log('Current Page', this.current, current, pageInfo)
    },
    onChange (pageInfo) {
      console.log('Page Info: ', pageInfo)
    }
  }
}
</script>

<style scoped>
@import url('../../../assets/career.css');
</style>
